// 引入 react 依赖
import React, { Component } from 'react';
import { connect } from 'react-redux';
import { Text, View, Image, TouchableOpacity, ImageBackground, ScrollView, InteractionManager, Alert } from 'react-native';

// 引入第三方依赖
import _ from 'lodash';
import pureRender from 'pure-render-decorator';
import Icon from 'react-native-vector-icons/Ionicons';
import { Actions } from 'react-native-router-flux';

// antd 按需加载
import { Toast } from '@ant-design/react-native';

// 引入 处理数据 所需文件
import { shopCartAdd } from '../../module/module.js'

// 引入样式
import Styles from './style.js';

// 引入公用组件
import { CacheImage } from '../../components/index.js'

// 引入工具包
import { background } from '../../util/images.js'
import { press, size, ScreenWidth, pathHead, defaultDataList, onEndReached, onRefresh, concatDataList, defaultPage } from '../../util/utils.js'

class Good extends Component {
	static propTypes = {

	}

	constructor(props) {
		super(props)
		this.state = {}
	}

	render() {
		const { data, width, select, onSelect } = this.props
		const reWidth = width / 2
		return (
			<View style={{
				backgroundColor: '#fff',
				width: reWidth,
				overflow: 'hidden',
				margin: .5,
			}}>
				<TouchableOpacity
					onPress={() => {
						if (select != undefined) {
							onSelect(data)
						} else {
							Actions.goodDetails({ goodsId: data.id, productId: data.productId, })
						}
					}}
				>
					<CacheImage
						resizeMod={"contain"}
						style={{
							marginTop: 5,
							marginLeft: 5,
							width: reWidth - 10,
							height: reWidth - 10,
							borderRadius: 10,
							overflow: 'hidden'
						}}
						source={{ uri: `${pathHead}${data.goodsMainPic}` }}

					/>
				</TouchableOpacity>
				<View style={{
					padding: 5
				}}>
					<View style={{
						marginBottom: 5,
					}}>
						<Text
							numberOfLines={1}
							ellipsizeMode={'tail'}
							style={{ fontSize: 13, color: '#333', lineHeight: 24, fontWeight: 'bold' }}
						>{data.goodsName}</Text>
						<Text style={{ fontSize: 12, color: '#333', lineHeight: 24, }}>{data.goodsNo}</Text>
					</View>
					<View style={{
						flexDirection: 'row',
						alignItems: 'flex-start',
						justifyContent: 'space-between',
					}}>
						<View style={{
							flex: 1,
							marginRight: 10
						}}>
							<View style={{
							}}>
								<Text style={{ fontSize: 14, color: '#E5C67B', lineHeight: 24, }}>￥{data.goodsPrice} | CV:{data.cv}</Text>
								<Text style={{ fontSize: 10, color: '#BBBDC0', lineHeight: 16, textDecorationLine: 'line-through' }}>￥{data.marketPrice}</Text>
							</View>
						</View>
						<TouchableOpacity
							onPress={() => {
								shopCartAdd({
									goodsId: data.id,
									goodsNumber: 1,
									productId: data.productId,
								})
							}}
							style={{
								marginRight: 5
							}}
						>
							<Icon name="md-cart" size={22} color={'#61676F'} />
						</TouchableOpacity>
					</View>
				</View>
			</View>
		)
	}
}

export default pureRender(Good)
